<template>
  <div class="login">
    <!-- 头部导航栏 -->

    <van-nav-bar title="手机号登录" left-text="×" @click-left="onClickLeft" />
    <h4 class="bioati">登录体验更多精彩</h4>
    <div class="tishi">未注册手机号登录后将自动创建账号</div>
    <!-- 输入框 -->
    <van-form @submit="onSubmit" class="shuru" border>
      <van-field
        v-model="phoneNumber"
        name="phoneNumber"
        label="+86"
        placeholder="输入手机号"
        :rules="[{ required: true, message: '请输入手机号' }]"
      />

      <div style="margin: 16px">
        <van-button round block type="danger">下一步</van-button>
      </div>
    </van-form>
  </div>
</template>

<script>
import { Toast } from "vant";
import { setToken } from "../utils/tools";
import { loadRegister } from "../services/resLogin";

export default {
  data() {
    return {
      phoneNumber: "",
    };
  },
  methods: {
    onClickLeft() {
      Toast("返回");
    },

    async onSubmit(values) {
      console.log(values);
      const res3 = await loadRegister(values.phoneNumber);
      console.log(res3);
      if (res3.nickname != null) {
        setToken(values.phoneNumber);
        this.$router.push({ name: "Reg" }); //已改
      } else {
        this.$router.push({ name: "Sign" }); //已改
      }
    },
  },
};
</script>
<style scoped>
.shuru {
  margin-top: 15vw;
}

.bioati {
  text-indent: 1.5rem;
  font-weight: normal;
}

.tishi {
  text-indent: 1.5rem;
  font-size: 12px;
  color: rgba(128, 128, 128, 0.74);
}
</style>
